<template>
 <div class="body">
  <div class="title">
    <div class="title-content">
        <image :src="listIcon" class="image left"/>
        <span class="title-span">${comments}列表</span>
        <image :src="addIcon" @click="toPage('/pages/module/${className?uncap_first}/${className?uncap_first}Detail?pageFrom=add')" class="image right"/>
    </div>
   </div>
   <div class="list-body">
      <uni-list>
         <uni-list-chat v-for="${className?uncap_first} in ${className?uncap_first}List" :key="${className?uncap_first}.id" clickable @click="toPage('/pages/module/${className?uncap_first}/${className?uncap_first}Detail?pageFrom=edit&id='+${className?uncap_first}.id)"
                       :avatar="titleIcon" :title="111" :note="222" :time="333" :badge-text="444">
         </uni-list-chat>
      </uni-list>
      <view class="loadMore" v-if="showLoadMore">{{loadMoreText}}</view>
    </div>
 </div>
</template>

<script>
    export default {
        data() {
            return {
                listIcon:'/static/images/list/list.png',
                addIcon:'/static/images/list/add.png',
                titleIcon:'/static/images/list/title.png',
                ${className?uncap_first}List: [],
                loadMoreText: "加载中...",
                showLoadMore: false,
                limit:15,
                page: 0,
                total: 0,
                max: 0
            }
        },
        computed: {
            <#list attrs as attr>
            <#if attr.isShow==1&&attr.inputType == 'select'>
            //【${attr.columnDesc}】数组
            ${attr.columnFieldName}Array: function() {
                return this.$store.getters.getDictArray('${attr.dictType}');
            }<#if attr_has_next>,</#if>
            </#if>
            </#list>
        },
        onLoad() {
            this.reset();
            this.getListData();
        },
        onReachBottom() {
            console.log("onReachBottom");
            if (this.max >= this.total) {
                this.showLoadMore = true;
                this.loadMoreText = "没有更多数据了!";
                return;
            }
            setTimeout(() => {
                this.getListData();
            }, 300);
        },
        methods: {
            //重置数据
            reset(){
                this.${className?uncap_first}List=[],
                    this.max=0,
                    this.page=0,
                    this.showLoadMore = false;
                    this.loadMoreText="加载中...";
            },
            <#list attrs as attr>
            <#if (attr.inputType == 'select')&&attr.isShow==1>
            //获取【${attr.columnDesc}】字典文本
            ${attr.columnFieldName}Name(value) {
                return this.$utils.getArrayName(this.${attr.columnFieldName}Array,value);
            },
            </#if>
            </#list>
            //获取数据列表
            getListData() {
                this.page += 1;
                this.max += this.limit;
                uni.showLoading({title:"加载中"});
                let that = this;
                this.$request.doGet('/api/${className?uncap_first}/getPage',{page:that.page,limit:that.limit}).then(res=>{
                    uni.hideLoading();
                    that.${className?uncap_first}List = that.${className?uncap_first}List.concat(res.obj.records);
                    that.total=res.count;
                })
            }
        }
    }
</script>

<style scoped>

</style>
